<template>
	<view class="left clearfix bai">
		<uni-popup ref="popup" type="center" @maskClick="closePopup()">
			<view class="login-box left clearfix relative">
				<view class="login-close absolute" @click="closePopup()">
					<uni-icons type="closeempty" color="#fff" size="18"></uni-icons>
				</view>
				<view class="login-title left clearfix">
					新增音频
				</view>
				
				<view class="add-input-box left" style="margin-top:60px;">
					<input placeholder="请输入标题" v-model="title"/>
				</view>
				<view class="add-input-box left">
					<input placeholder="请输入序列号" v-model="sort"/>
				</view>
				<view class="login-errMssage left clearfix" v-if="errMessage">
					<uni-icons type="icon-cuowu10" size="15" color="red" custom-prefix="iconfont"></uni-icons> {{errMessage}}
				</view>
				<view class="login-errMssage left clearfix" v-else>
					
				</view>
				<view class="add-submit left" @click="submitForm()">
					确定
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<style scoped>
	.login-errMssage{width:100%;height:30px;line-heght:30px;text-align: center;color:red;margin-top:20px;font-size:14px;}
	.add-submit{width:60%;height:45px;line-height:45px;border-radius: 22.5px;background:#2979ff;color:#fff;text-align: center;margin-left:20%;margin-top:25px;cursor:pointer;}
	.add-input-box input{width:calc(100% - 10px);padding-left:10px;height:50px;line-height:50px;}
	.add-input-box{width:80%;margin-left:10%;margin-top:40px;border:1px solid #ccc;height:50px;line-height:50px;border-radius: 5px;}
	.login-title{width:100%;height:30px;font-size:20px;font-weight:500;text-align: center;margin-top:20px;color:#151b26;}
	.login-close{width:35px;height:35px;line-height:35px;text-align:center;border-radius: 50%;background:rgba(21, 27, 38, .2);top:5px;right:10px;cursor: pointer;}
	.login-box{width:600px;height:420px;background:#fff;border-radius: 12px;}
</style>

<script>
	var db = uniCloud.database();
	var global = uniCloud.importObject('global',{customUI:true});
	export default {
		name:"add-popup",
		data() {
			return {
				title:'',
				errMessage:'',
				sort:0,
				editIndex:null,//当前编辑的索引
			};
		},
		props:{
			show:{
				type:Boolean,
				default:true
			},
			userinfo:{
				type:Object,
				default:null
			},
			sortNumber:{
				type:Number,
				default:0
			},
			parentId:{
				type:String,
				default:''
			},
			editData:{
				type:Object,
				default:null
			}
		},
		mounted() {
			var that = this;
			setTimeout(function(){
				that.sort = parseInt(that.sortNumber) + 1;
			},2000);
		},
		watch:{
			"show"(val){
				if(val == false){
					this.$refs.popup.close();
				}else{
					this.$refs.popup.open();
				}
			},
			
			"editData"(val){
				if(val && val.item){
					var item = val.item;
					this.editIndex = val.index;
					this.sort = parseInt(item.sort);
					this.title = item.title;
				}
				
			}
		},
		methods:{
			//点击确定以后
			submitForm(){
				var that = this;
				var title = this.title;
				var userinfo = this.userinfo;
				if(!title){
					this.errMessage = '请输入音频标题';
					return false;
				}else{
					this.errMessage = '';
				}
				
				if(!userinfo || !userinfo._id){
					this.errMessage = '用户未登录';
					return false;
				}else{
					this.errMessage = '';
				}
				
				uni.showLoading({
					title:'保存中'
				})
				var data = {
					uid:userinfo._id,
					title:title,
					chapter_number:0,
					sort:parseInt(that.sort),
					parent_id:that.parentId,
					is_publish:false,
					type:'chapter',
					audio:'',
					content:'',
					create_date:new Date().getTime()
				}
				var editData = that.editData;
				if(!editData.item || !editData.item._id){
					db.collection('timbre_title').add(data).then(res=>{
						data._id = res.result.id;
						global.setChapterNumber(data.parent_id,'inc');
						uni.hideLoading()
						uni.showToast({
							title:'添加成功',
							icon:'none',
							duration:2000
						})
						that.closePopup();
						that.$emit('confirm',data);
						that.title = '';
						
					}).catch(err=>{
						console.log('err',err);
						uni.hideLoading()
					});
				}else{
					db.collection('timbre_title').where({_id:editData.item._id}).update({title:data.title,sort:parseInt(data.sort)}).then(res=>{
						data._id = editData.item._id;
						uni.hideLoading()
						uni.showToast({
							title:'修改成功',
							icon:'none',
							duration:2000
						})
						that.closePopup();
						that.$emit('confirm',{data:data,index:that.editIndex});
						that.title = '';
						
					}).catch(err=>{
						uni.hideLoading()
					});
				}
				
			},
			//关闭弹窗
			closePopup(){
				this.$refs.popup.close();
				this.$emit('close',false);
			}
		}
	}
</script>
